﻿@using ECGadmin.Common
@using ECGadmin.WebUI.Models
@using ECGadmin.WebUI.CustomHelpers
@model IEnumerable<ProductCategoryDto>
@{
    ViewBag.Title = "Danh mục sản phẩm";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@section LeftMenu
{
    <div id="left">
        <div class="LeftMenuWraper">
            <div class="leftMenuHeader">
                <span style="padding-left: 10px;">
                    <strong>Truy cập nhanh</strong>
                </span>
            </div>
            <ul id="p-quick-menu" class="quick-menu">
                <li class="qmn-info-pro">
                    <a href="@Url.Action("Index", "ProductCategory")">Thông tin danh mục</a>
                </li>
                <li class="qmn-info-pro">
                    <a href="@Url.Action("CategoryBanner", "ProductCategory")">Banners category</a>
                </li>
                <li class="qmn-info-pro">
                    <a href="@Url.Action("TemplateList", "ProductCategory")">Template danh mục</a>
                </li>
                <li class="qmn-info-pro">
                    <a href="@Url.Action("Index", "Product")">Danh sách sản phẩm</a>
                </li>
            </ul>
            <div class="leftMenuFooter"></div>
        </div>
    </div>
    <!-- END #left -->
}
<nav>
    <div class="breadCrumb">
        <ul>
            <li><a href="@Url.Action("Index", "Home")"><i class="bootstrap icon-home"></i></a></li>
            <li><a href="javascript:void(0)">Sản phẩm</a> </li>
            <li><a href="@Url.Action("Index", "ProductCategory")">Danh mục sản phẩm</a> </li>
        </ul>
    </div>
</nav>
<div class="toolBox">
    @Html.ToolBox(new List<object>
                      {
                          new Add { ActionName = Url.Action("AddCategory", "ProductCategory"), ClassCss = "Add" },
                          new Delete { ActionName = "", ClassCss = "Del" },
                          new Refresh { ActionName = Url.Action("Index", "ProductCategory"), ClassCss = "Refresh" },
                      })
</div>
<div class="m-t-b-20">
    @Html.DropDownList("ProductCategoryList", new SelectList((List<ProductCategoryDto>)ViewBag.ParentList, "Id", "Name"))
</div>
<div class="box-Info">
    <div class="Info-header">
        <span>Danh sách các danh mục sản phẩm</span>
    </div>
    <div class="Info-body">
        <table class="table-odd" cellspacing="0" cellpadding="0">
            <thead>
                <tr>
                    <th style="width: 35px; text-align: center; padding-left: 0;">@Html.CheckBox("chkAll")
                    </th>
                    <th style="width: 30px;">&nbsp;
                    </th>
                    <th>Tên danh mục
                    </th>
                    <th style="width: 40px;">Thứ tự
                    </th>
                    <th style="width: 50px;">Hiển thị
                    </th>
                </tr>
            </thead>
            <tbody>
                @if (Model != null)
                {
                    foreach (var item in Model)
                    {
                    <tr class="trHeight">
                        <td class="bgTableFirst">
                            @Html.CheckBox("chkItem")
                        </td>
                        <td style="text-align: center; width: 30px;">
                            <a href="javascript:void(0);" class="cate-expand" id="@item.Id" deep="1">[+] </a>
                        </td>
                        <td style="text-align: left;">
                            <a href="@Url.Action("EditCategory", "ProductCategory", new { ID = item.Id })" title="@item.Name">@item.Name</a>
                            <div class="info-ad-qv">
                                <a href="@Url.Action("EditCategory", "ProductCategory", new { id = @item.Id })">Sửa</a> | 
                                        <a href="">Sửa nhanh</a> | 
                                        <a href="javascript:void(0);" class="icon-del2 ad-qv-txt2" cateId="@item.Id">Xóa</a> | 
                                        <a href="">Xem</a>
                            </div>
                        </td>
                        <td>
                            @string.Format("{0}", item.Ordering < 0 ? "0" : item.Ordering.ToString())
                        </td>
                        <td>
                            @Html.CheckBox("chbCateActive", item.Active)
                        </td>

                    </tr>
                    }
                }
            </tbody>
        </table>
    </div>
</div>
@section scripts
{
    <script type="text/javascript">
        bindClickRecursion();
        deleteCategory();

        // Đệ qui
        function bindClickRecursion() {
            $('.cate-expand').click(function () {
                var parent = $(this).parent().parent();
                var id = $(this).attr('id');
                var checkOpened = $(this).hasClass('itemOpened');
                if (checkOpened) {
                    if ($('.' + id).eq(0).is(':visible')) {
                        $('.' + id).hide();
                        $(this).text('[+]');
                        return false;

                    } else {
                        $('.' + id).show();
                        $(this).text('[ - ]');
                        return false;
                    }
                }

                var deep = $(this).attr('deep');
                var strStyle = '';
                if (deep == 3) {
                    strStyle = 'padding-left: 30px;';
                }

                $.ajax({
                    url: '/ProductCategory/GetCateChildList',
                    data: { id: id },
                    success: function (data) {
                        if (data.length > 0) {
                            var elementAdded = '';
                            for (var i = 0; i < data.length; i++) {
                                //deep++;
                                var padd = '';
                                if (deep <= 1) {
                                    padd = '19px';
                                } else {
                                    padd = '65px';
                                }
                                var order = data[i]['Ordering'] < 0 ? '0' : data[i]['Ordering'];
                                var checked = data[i]['Active'] ? 'checked' : '';
                                elementAdded += '<tr class="' + id + ' trHeight">' +
                                    '<td class="bgTableFirst"></td>' +
                                    '<td style="text-align: center;">' +
                                    '</td>' +
                                    '<td style="text-align:left;' + strStyle + '">';
                                var line = '';
                                var line2 = '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;--';
                                if (data[i]["Depth"] >= 3) {
                                    line = '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;------';
                                    line2 = '';
                                }
                                if (data[i]["totalSubcate"] != '0') {
                                    elementAdded += '<a href="javascript:void(0)" class="cate-expand" id="' + data[i]['Id'] + '" deep="' + data[i]["Depth"] + '">[+]--</a> ';
                                } else {
                                    elementAdded += line2;
                                }

                                elementAdded += line + '<a class="subcate-ad" href="/ProductCategory/EditCategory/' + data[i]['Id'] + '" title="' + data[i]['Name'] + '">' + data[i]['Name'] + '</a>' +
                                '<div class="info-ad-qv" style="padding-left: ' + padd + ';">' +
                                '<a href="/ProductCategory/EditCategory/' + data[i]['Id'] + '">Sửa</a> | ' +
                                '<a href="">Sửa nhanh</a> | ' +
                                '<a href="javascript:void(0);" class="icon-del2 ad-qv-txt2" cateId="' + data[i]['Id'] + '">Xóa</a> | ' +
                                '<a href="">Xem</a>' +
                                '</div>' +
                                '</td>' +
                                '<td>' + order + '</td>' +
                                '<td><input type="checkbox" name="chbCateActive" id="chbCateActive" ' + checked + '/></td>' +
                                '</tr>';
                            }
                            parent.after(elementAdded);
                            parent.find('.cate-expand').addClass('itemOpened').text('[ - ]');
                            $('.cate-expand').unbind('click');
                            $('.icon-del2').unbind('click');
                            bindClickRecursion();
                            deleteCategory();
                        }
                    },
                    errors: function () {
                        alert('Đã có lỗi xảy ra!');
                    }
                });
            });
        }

        // Delete category
        function deleteCategory() {
            $('.icon-del2').click(function () {
                if (!confirm('Bạn chắc chắn muốn xóa danh mục này!')) return false;
                var cateId = $(this).attr('cateId');
                var grandChild = $(this).parent().parent();
                $.ajax({
                    url: '/ProductCategory/DeleteCategory',
                    data: { id: cateId },
                    success: function (result) {
                        if (result) {
                            alert('Xóa danh mục thành công!');
                            grandChild.remove();
                        } else {
                            alert('Danh mục đã có sản phẩm hoặc có danh mục con!');
                        }
                    },
                    error: function () {
                        alert('Đã có lỗi xảy ra!');
                    }
                });
            });
        }

        // Redirect to edit category
        $('#ProductCategoryList').change(function () {
            var id = $(this).val();
            window.location = '/ProductCategory/EditCategory/' + id;
        });
    </script>
}
